import React from 'react';
import { Button, Message } from '@teamix/ui';
import './index.scss';
import exceed from 'utils/apimap';
import { navigate } from 'utils/router';

export default function index(props) {
  const { AuthFinishedStatus, applicationInfo } = props;
  const cancelAuth = () => {
    if (AuthFinishedStatus.isUnBindFinished) {
      return <div className="finished_auth_message">你已取消授权，请勿重复操作</div>;
    }
    return (
      <div>
        <div className="auth_content_cancel_auth">
          <p className="info_list">
            确认取消应用{applicationInfo.description}对云效Codeup的访问权限吗？
          </p>
          <p className="info_list">取消后该应用将无法获取你的个人信息和代码库/组数据。</p>
        </div>
        <div style={{ marginTop: '60px' }}>
          <Button
            className="auth_btn"
            type="normal"
            onClick={() =>
              Message.show({
                duration: 2000,
                type: 'warning',
                title: '暂不取消',
                style: {
                  position: 'fixed',
                },
                afterClose: () => {
                  navigate(applicationInfo.redirect_uri);
                },
              })
            }
          >
            暂不取消
          </Button>
          <Button onClick={cancelAuthBtn} type="primary">
            取消授权
          </Button>
        </div>
      </div>
    );
  };
  const cancelAuthBtn = () => {
    exceed
      .fetch({
        api: 'auth.cancel',
        data: {
          app_id: applicationInfo.app_id,
        },
      })
      .then((result) => {
        if (result) {
          Message.show({
            title: '取消授权成功',
            duration: 2000,
            style: {
              position: 'fixed',
            },
            afterClose: () => {
              window.location.reload();
            },
          });
        }
      })
      .fail((err) => {
        console.log(err);
      });
  };
  return <div className="auth_content_wrap">{cancelAuth()}</div>;
}
